<template>
  <view style="height: 100vh;overflow: hidden;">
    <view
      style="width: 750rpx;height: 100vh;background-color: rgba(0,0,0,0.8);display: flex;flex-direction: column;align-items: center;justify-content: center;">
      <image :src="myhead"
        style="width: 100rpx;height: 100rpx;border-radius: 10rpx;margin-bottom: 20rpx;" mode=""></image>
      <text style="color: #fff;margin-bottom: 20rpx;">{{myname}}</text>
      <text style="color: #fff;">邀请您进行{{type == 'video' ? '视频' : '语音'}}通话</text>
    </view>
    <view class="down-box">
      <view class="center" @click="back">
        <image src="../static/guaduan.png" mode=""></image>
        <text>挂断</text>
      </view>
      <view class="center" @click="tocall">
        <image src="../static/jieting.png" mode=""></image>
        <text>接通</text>
      </view>
    </view>
  </view>
</template>

<script>
  const call = uni.requireNativePlugin('Html5App-TencentCall');
  export default {
    data() {
      return {
        sign: '',
        myname: '',//对方的名字
        myhead: '',//对方的头像
        youname: '',//我的头像
        youhead: '',//我的名字
        roomID: '',
        sign: '',
        type: '',
        to_id:''
      }
    },
    onLoad(option) {
      this.myname = option.myname
      this.myhead = option.myhead
      this.youname = option.youname
      this.youhead = option.youhead
      this.roomID = option.roomID
      this.sign = option.sign
      this.type = option.type
      this.to_id = option.to_id
      // this.tocall()
    },
    beforeDestroy() {
      //发送消息
      let message = uni.$tim.createCustomMessage({
        to: this.to_id,
        conversationType: 'C2C',
        payload: {
          data: 'videomsg',
          description: '0',//1拨打0挂断
        }
      })
      let promise = uni.$tim.sendMessage(message);
      promise.then((imResponse) => {
        // 发送成功
        console.log("退出成功");
      }).catch(function(imError) {
        // 发送失败
        console.warn('sendMessage error:', imError);
      });
    },
    methods: {
      back(){
        uni.navigateBack()
      },
      tocall() {
        call.openCall({
          "type": 1, //1 代表对一对一界面,0 代表默认界面  
          "callType": this.type, // 留空，使用默认模式，video 是视频，voice 是语音通话
          "username": this.myname, //对方的用户昵称
          "useravatar": this.myhead, //对方的头像
          "myname": this.youname, //我的昵称
          "myavatar": this.youhead, //我的头像
          "wait": "正在等待对方接受邀请...",
          "prompt": "通话中...",
          "userid": uni.getStorageSync("user_id"), //'20',// 我的腾讯云通话用户id
          "roomid": this.roomID, //房间号, 数字,随着填写
          "usersig": this.sign, //用户名加密串
          "hideTabVoice": true ,//隐藏语音视频切换按钮
          "isshowFloat":1//是否显示缩放图标(安卓端有效),0=>显示，1=隐藏
        }, ret => {
          console.log(JSON.stringify(ret));
          if(ret.code == 1){
            this.back()
          }
        });
      }
    }
  }
</script>

<style lang="scss">
.down-box {
    position: fixed;
    bottom: 20rpx;
    left: 0;
    width: 750rpx;
    display: flex;
    padding: 0 50rpx;
    align-items: center;
    box-sizing: border-box;
    justify-content: space-between;


    .center {
      display: flex;
      flex-direction: column;
      align-items: center;

      image {
        width: 120rpx;
        height: 120rpx;
        border-radius: 100rpx;
      }

      text {
        margin-top: 20rpx;
        color: #fff;
      }
    }
  }
</style>
